CSS Findings From The Threads App

The author, a CSS teacher, inspected the CSS of public Threads posts viewable on the web and reports several layout techniques used in the app. The post layout is built with CSS Grid, using a 2-column, 4-row grid with items manually placed via grid-column and grid-row, and the avatar is padded and spans two rows. The author notes that fixed row values such as 21px and 19px appear to be manual UI fine-tuning, and that the thread-line swirl is an SVG path whose first segment length is calculated with JavaScript. The author also highlights an inline CSS variable that sets the tab count for the profile tabs grid, and the use of dvh units on the splash screen.